﻿<%@ page language="java" contentType="text/html; charset=UTF-8"   pageEncoding="UTF-8"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="apple-itunes-app" content="app-id=591578609">
<meta name="viewport" content="width=device-width"/>
<meta name="description" content="筑学堂网校" />
<meta name="keywords" content="筑学堂网校、建筑、考试"/>
<link rel="stylesheet" type="text/css" href="${csspath}/style/my_plat.css">
<link rel="stylesheet" type="text/css" href="${csspath}/style/my_course.css">
<link rel="stylesheet" type="text/css" href="${csspath}/style/tab.css">
<!--[if IE 7]>
<link rel="stylesheet" href="/css/font-awesome/css/font-awesome-ie7.min.css">
<![endif]-->
<script type="text/javascript" src="${jspath}/js/jquery-1.7.0.min.js"></script>
<script type="text/javascript" src="${jspath}/js/study.js"></script>
<script type="text/javascript" src="${jspath}/js/base.js"></script>
<script type="text/javascript" src="${jspath}/js/exam.js"></script>
<script type="text/javascript">
	function publishComment(){
		var commentText = document.getElementById("comment_input").value;
		var commentStar = document.getElementById("comment_star").value;
		var callbackFun = function(htmlContent){
			 alert("评论成功！");
		};
		AjaxToolNoEncode("post","/student/curriculum/addComment/${myCourse.courseId}/-1/"+commentText+"/"+commentStar,{},"html",callbackFun);
	}
	
	function repComment(pid){
		var commentText = document.getElementById(pid).value;
		alert(commentText);
		var callbackFun = function(htmlContent){
			 alert("评论成功！");
		};
		AjaxToolNoEncode("post","/student/curriculum/addComment/${myCourse.courseId}/"+pid+"/"+commentText+"/10",{},"html",callbackFun);
	}
</script>
<title>筑学堂家园个人空间</title>
<style type="text/css">
a {
	color:#222;
	text-decoration:none;
}

ol li {
	list-style-position:inside;
}
</style>
</head>
<body style="align:center; padding:0;margin:0;clear:both; background-color:F7F7F7;">
<!--顶部导航-->
<div class="user_top">
 
	<iframe src="../../../common/header" width="100%" height="100%"  frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes"></iframe>
 
</div>
<!--end顶部导航-->
<div class="course_topicbody">
  <c:choose>
	<c:when test="${not empty error}">
	  <div class="course_topic"> 我的学堂&gt; 
	    <a href="javascript:history.go(-1);" style="color:#0A8CD2">我的课程</a>
	  </div>
	  <div class="course_topic">${error}</div>
	</c:when>
	<c:otherwise>
		<div class="course_topic"> 我的学堂&gt; <a href="javascript:history.go(-1);" style="color:#0A8CD2">我的课程</a> &gt;
			${myCourse.courseName} </div>
		<div class="courtopic_course">
			<div class="courtopic_pic"> <img src="http://resource.zhuclass.com/cdrmimg/${myCourse.coursePimg}?w=240&h=180" width="200" height="150" /> </div>
			<div class="courtopic_name">
				<div class="courtopic_name01"> ${myCourse.courseName} </div>
				<div class="courtopic_name02"> ${myCourse.countStu}人在学习 </div>
				<div class="courtopic_name03"> 总课程：${myCourse.courseTimes} </div>
				<div class="courtopic_name03"> 总学时：${myCourse.courseTimes} </div>
				<div class="courtopic_name04"> 请点击课程列表右侧的按钮进入学习 </div>
			</div>
			<div class="courtopic_namer">
				<div class="courtopic_namer01"> 已获得总学分：<span style="font-size:14px;"> ${myCourse.courseCredit} 分</span> </div>
				<div class="courtopic_namer02"> 总进度： </div>
				<div class="courtopic_namer03">
					<div style="width:${myCourse.progress}%;"> <span>${myCourse.progress}%</span> </div>
				</div>
				<div class="courtopic_namer04"> ${myCourse.progress}% </div>
			</div>
		</div>
		
		<div class="kczx_son_divbodytb">
			<div class="kczx_son_divbodytbl">
				<ul class="tabs">
					<a href="#" rel="external" id="a1" class="up" onClick="litab(1,5);"  style="background-color:#159E6B;color:#F7F7F7;">
					<li id="li1" >课时列表</li>
					</a>
					<div class="tab00"> &nbsp;</div>
					<a href="#" rel="external" id="a2"  onClick="litab(2,5);" >
					<li>笔&nbsp;&nbsp;记</li>
					</a>
					<div class="tab00"> &nbsp;</div>
					<a href="#" rel="external" onClick="litab(3,5);"  id="a3">
					<li>评&nbsp;&nbsp;论</li>
					</a>
					<div class="tab00"> &nbsp;</div>
					<a href="#" rel="external" onClick="litab(4,5);"  id="a4">
					<li>课程介绍</li>
					</a>
					<div class="tab00"> &nbsp;</div>
					<a href="#" rel="external" onClick="litab(5,5);"  id="a5">
					<li>同&nbsp;&nbsp;学</li>
					</a>
				</ul>
				<!--课时列表-->
				<div id="tab1" class="tab">
				  <c:forEach items="${pageList.data}" var="ctgObject">
					<div class="tab1_body01">
						<div class="tab1_body0101"> 课时${ctgObject.seq}</div>
						<div class="tab1_body0102">
							<div class="tab1_body010201"> </div>
						</div>
						<div id="col1"  class="tab1_body0103"> 
							<c:choose>  
							   <c:when test="${ispublic}">
									<a href="/student/curriculum/pinitVideo/${ctgObject.courseId}/${ctgObject.id}/${ctgObject.categorySourceid}"  	target="_blank"> 
							   </c:when>  
							   <c:otherwise>
							   		<a href="/student/curriculum/initVideo/${ctgObject.courseId}/${ctgObject.id}/${ctgObject.categorySourceid}"  	target="_blank"> 
							   </c:otherwise>  
							</c:choose>
										${ctgObject.categoryName}
						  		 	</a>
						</div>
					</div>
					<c:forEach items="${ctgObject.homeworkVo}" var="homeworkVo">
						
						<div class="tab1_body01">
								<div class="tab1_body0101"> </div>
								<div class="tab1_body0102">
									<div class="tab1_body010202"> </div>
								</div>
							
								<div id="coll1"  class="tab1_body0105"> 
								  <a href="/student/curriculum/initHomework/${ homeworkVo.id}" target="_blank">
								  	${ homeworkVo.homeworkName}
								  </a> 
								</div>
						</div>
						
					</c:forEach>
					
					<c:forEach items="${ctgObject.examVo}" var="examVo">
						<div class="tab1_body01">
								
								<div class="tab1_body0101"> </div>
								<div class="tab1_body0102">
									<div class="tab1_body010203"> </div>
								</div>
							
								<div id="coll2"  class="tab1_body0105"> 
								  <a href="/student/exam/${ examVo.id}" target="_blank">
									${ examVo.examName}
								  </a> 
								</div>
							
						</div>
					</c:forEach>
					
				  </c:forEach>
				</div>
				<!--end课时列表--> 
				
				<!--笔记-->
				<div id="tab2" class="tab2">
				  <c:forEach items="${noteList.data}" var="noteObject">
					<div class="tab2_body">
						<div class="tab2_body01">
							<div class="tab2_body0101">
								<div class="tab2_body010101"> <span style="color:#2884b3;">${fn:substring(noteObject.createDt, 0, 10)} 笔记</span> ${noteObject.noteName} </div>
								<p style="word-break:break-all; word-wrap:break-word;">
								  ${fn:substring(noteObject.noteText, 0, 150)}...
								</p>
							</div>
							<div class="tab2_body0102">
								<div class="tab2_body010201"> 
								  <img src="http://resource.zhuclass.com/cdrmimg/${noteObject.userHimg}?w=65&h=65" width="65" height="65"/><br/>
									${noteObject.userName} </div>
							</div>
						</div>
						<div class="tab2_body02"> ${fn:substring(noteObject.createDt, 0, 16)} 
						  <a href="#">
							  <span class="tab2_body0201">
							    <img src="${csspath}images/kczx_son/zan.png"/>&nbsp;&nbsp;赞（${noteObject.coolCnt}）
							  </span>
						  </a> 
						</div>
					</div>
				  </c:forEach>
				</div>
				<!--end笔记-->
				
				<div id="tab3" class="tab3">
					<div id="sitelogo">
						<ul class="starrating">
							<li class="currentrating"> </li>
							<li><a onmouseover="infen(1)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=1','ConfirmStar','GET','');" class="star1">1</a></li>
							<li><a onmouseover="infen(2)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=2','ConfirmStar','GET','');" class="star2">2</a></li>
							<li><a onmouseover="infen(3)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=3','ConfirmStar','GET','');" class="star3">3</a></li>
							<li><a onmouseover="infen(4)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=4','ConfirmStar','GET','');" class="star4">4</a></li>
							<li><a onmouseover="infen(5)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=5','ConfirmStar','GET','');" class="star5">5</a></li>
							<li><a onmouseover="infen(6)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=6','ConfirmStar','GET','');" class="star6">6</a></li>
							<li><a onmouseover="infen(7)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=7','ConfirmStar','GET','');" class="star7">7</a></li>
							<li><a onmouseover="infen(8)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=8','ConfirmStar','GET','');" class="star8">8</a></li>
							<li><a onmouseover="infen(9)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=9','ConfirmStar','GET','');" class="star9">9</a></li>
							<li><a onmouseover="infen(10)" onMouseOut="infen(0)" href="javascript:makeRequest('/student/curriculum/commentStar?fen=10','ConfirmStar','GET','');" class="star10">10</a></li>
						</ul>
						<span id="pftip"></span> <span id="pfno"></span> 
					</div>
					<div class="tab301">
						<input id="comment_star" type="hidden">
						<input id="comment_input" type="text" style="width:700px;height:100px;padding:0px;"/>
						<div class="tab302"> 您还可以输入200字 
						<a href="#" onclick="publishComment()">
							<img src="${csspath}/images/kczx_son/pl01.jpg"/> 
						</a>
						</div>
					</div>
					<div class="tab303"> <a href="#" onMouseDown="tab300(1,5);">
						<div id="tab0301" class="tab30301"> 全部 </div>
						</a> <a  href="#" onMouseDown="tab300(2,5);" >
						<div id="tab0302" class="tab30301" style="background-color:#E2EFFC;border:1px solid #E2EFFC"> 好评 </div>
						</a> <a href="#" onMouseDown="tab300(3,5);">
						<div id="tab0303" class="tab30301" style="background-color:#E2EFFC;border:1px solid #E2EFFC"> 中评 </div>
						</a> <a href="#" onMouseDown="tab300(4,5);">
						<div id="tab0304" class="tab30301" style="background-color:#E2EFFC;border:1px solid #E2EFFC"> 差评 </div>
						</a> 
					</div>
					
					<div id="tab3001" class="tab300">
					  <c:forEach items="${commentList.data}" var="comment" varStatus="stat">
					  <c:if test="${comment.commontPid == -1}">
						<div class="tab30001">
							<div class="tab30002"> <img src="http://resource.zhuclass.com/cdrmimg/${comment.userHimg}?w=65&h=65" width="65" height="65"> </div>
							<div class="tab30003">
								<div class="tab3040102">
									<div class="tab3040103"> <a href="#"><span class="retext05">${comment.userName}</span></a>给课程打了${comment.commentStar}分
										<div class="tab304010301"> <a style="color:#2884b3;" onMouseDown="rep1(${stat.index+1},1000,${comment.id});" href="#">回复</a> </div>
									</div>
									<div class="tab3040104">${comment.commontText} </div>
									<div class="tab3040105">${fn:substring(comment.commontCdt, 0, 16)}</div>
								</div>
								<c:forEach items="${commentSubList.data}" var="replayCmt" varStatus="replayStat">
							      <c:if test="${comment.id == replayCmt.commontPid}">
									  <div class="tab305">
										<div class="tab3050101"> <img src="http://resource.zhuclass.com/cdrmimg/${replayCmt.userHimg}?w=65&h=65" width="65" height="65"> </div>
										<div class="tab3050102">
											<div class="tab3050103"> <a href="#"><span class="retext05">${replayCmt.userName}</span></a>回复 <a href="#"><span class="retext05">${comment.userName}</span></a>
												<div id="replay0101" class="tab305010301"> <a style="color:#2884b3;" onMouseDown="rep1(${replayStat.index+1},1000,${replayCmt.id});;" href="#">回复</a> </div>
											</div>
											<div class="tab3050104"> ${replayCmt.commontText} </div>
											<div class="tab3050105">${fn:substring(replayCmt.commontCdt, 0, 16)} </div>
										</div>
									  </div>
								  </c:if>
								</c:forEach>
								
								<div id="replay1${stat.index+1}" class="tab30004">
									<input id="comment_id" type="hidden" value=""/>
									<input id="${comment.id}" type="text" style="width:590px;height:70px;padding:0px;">
									<a href="#" onclick="repComment('${comment.id}')">
									<div class="tab30005"> 发&nbsp;表 </div>
									</a> </div>
							</div>
						</div>
						</c:if>
					  </c:forEach>
					</div>
					
					<div id="tab3002" class="tab300" style="display:none">
					  <c:forEach items="${commentList.data}" var="comment" varStatus="stat">
					  <c:if test="${comment.commontPid == -1 && comment.commentStar > 6}">
						<div class="tab30001">
							<div class="tab30002"> <img src="http://resource.zhuclass.com/cdrmimg/${comment.userHimg}?w=65&h=65" width="65" height="65"> </div>
							<div class="tab30003">
								<div class="tab3040102">
									<div class="tab3040103"> <a href="#"><span class="retext05">${comment.userName}</span></a>给课程打了${comment.commentStar}分
										<div class="tab304010301"> <a style="color:#2884b3;" onMouseDown="rep1(${stat.index+1},1000,${comment.id});" href="#">回复</a> </div>
									</div>
									<div class="tab3040104">${comment.commontText} </div>
									<div class="tab3040105">${fn:substring(comment.commontCdt, 0, 16)}</div>
								</div>
								<c:forEach items="${commentSubList.data}" var="replayCmt">
							      <c:if test="${comment.id == replayCmt.commontPid}">
									<div class="tab305">
										<div class="tab3050101"> <img src="http://resource.zhuclass.com/cdrmimg/${replayCmt.userHimg}?w=65&h=65" width="65" height="65"> </div>
										<div class="tab3050102">
											<div class="tab3050103"> <a href="#"><span class="retext05">${replayCmt.userName}</span></a>回复 <a href="#"><span class="retext05">${comment.userName}</span></a>
												<div id="replay0101" class="tab305010301"> <a style="color:#2884b3;" onMouseDown="rep2(${stat.index+1},1000,${comment.id});" href="#">回复</a> </div>
											</div>
											<div class="tab3050104">${replayCmt.commontText} </div>
											<div class="tab3050105">${fn:substring(replayCmt.commontCdt, 0, 16)}</div>
										</div>
									</div>
								  </c:if>
								</c:forEach>
								
								<div id="replay21" class="tab30004">
									<input id="${comment.id}" type="text" style="width:590px;height:70px;padding:0px;">
									<a href="#"  onclick="repComment('${comment.id}')">
									<div class="tab30005"> 发&nbsp;表 </div>
									</a> </div>
							</div>
						</div>
					  </c:if>
					  </c:forEach>
					</div>
					
					<div id="tab3003" class="tab300" style="display:none">
					  <c:forEach items="${commentList.data}" var="comment" varStatus="stat">
					  <c:if test="${comment.commontPid == -1 && (comment.commentStar > 2 && comment.commentStar<= 6)}">
						<div class="tab30001">
							<div class="tab30002"> <img src="http://resource.zhuclass.com/cdrmimg/${comment.userHimg}?w=65&h=65" width="65" height="65"> </div>
							<div class="tab30003">
								<div class="tab3040102">
									<div class="tab3040103"> <a href="#"><span class="retext05">${comment.userName}</span></a>给课程打了${comment.commentStar}分
										<div class="tab304010301"> <a style="color:#2884b3;" onMouseDown="rep3(${stat.index+1},1000,${comment.id});" href="#">回复</a> </div>
									</div>
									<div class="tab3040104"> ${comment.commontText} </div>
									<div class="tab3040105"> ${fn:substring(comment.commontCdt, 0, 16)}</div>
								</div>
								<c:forEach items="${commentSubList.data}" var="replayCmt">
							      <c:if test="${comment.id == replayCmt.commontPid}">
									<div class="tab305">
										<div class="tab3050101"> <img src="http://resource.zhuclass.com/cdrmimg/${replayCmt.userHimg}?w=65&h=65" width="65" height="65"> </div>
										<div class="tab3050102">
											<div class="tab3050103"> <a href="#"><span class="retext05">${replayCmt.userName}</span></a>回复 <a href="#"><span class="retext05">${comment.userName}</span></a>
												<div id="replay0101" class="tab305010301"> <a style="color:#2884b3;" onMouseDown="rep3(1,1000);" href="#">回复</a> </div>
											</div>
											<div class="tab3050104">${replayCmt.commontText} </div>
											<div class="tab3050105"> ${fn:substring(replayCmt.commontCdt, 0, 16)}</div>
										</div>
									</div>
								  </c:if>
								</c:forEach>
								
								<div id="replay31" class="tab30004">
									<input  id="${comment.id}" type="text" style="width:590px;height:70px;padding:0px;">
									<a href="#"  onclick="repComment('${comment.id}')">
									<div class="tab30005"> 发&nbsp;表 </div>
									</a> </div>
							</div>
						</div>
					  </c:if>
					  </c:forEach>
					</div>
					
					<div id="tab3004" class="tab300" style="display:none">
					  <c:forEach items="${commentList.data}" var="comment" varStatus="stat">
					  <c:if test="${comment.commontPid == -1 && comment.commentStar <= 2}">
						<div class="tab30001">
							<div class="tab30002"> <img src="http://resource.zhuclass.com/cdrmimg/${comment.userHimg}?w=65&h=65" width="65" height="65"> </div>
							<div class="tab30003">
								<div class="tab3040102">
									<div class="tab3040103"> <a href="#"><span class="retext05">${comment.userName}</span></a>给课程打了${comment.commentStar}分
										<div class="tab304010301"> <a style="color:#2884b3;" onMouseDown="rep4(${stat.index+1},1000,${comment.id});" href="#">回复</a> </div>
									</div>
									<div class="tab3040104"> ${comment.commontText}  </div>
									<div class="tab3040105"> ${fn:substring(comment.commontCdt, 0, 16)}</div>
								</div>
								<c:forEach items="${commentSubList.data}" var="replayCmt">
							      <c:if test="${comment.id == replayCmt.commontPid}">
									<div class="tab305">
										<div class="tab3050101"> <img src="http://resource.zhuclass.com/cdrmimg/${replayCmt.userHimg}?w=65&h=65" width="65" height="65"> </div>
										<div class="tab3050102">
											<div class="tab3050103"> <a href="#"><span class="retext05">${replayCmt.userName}</span></a>回复 <a href="#"><span class="retext05">${comment.userName}</span></a>
												<div id="replay0101" class="tab305010301"> <a style="color:#2884b3;" onMouseDown="rep4(1,1000);" href="#">回复</a> </div>
											</div>
											<div class="tab3050104">${replayCmt.commontText} </div>
											<div class="tab3050105"> ${fn:substring(replayCmt.commontCdt, 0, 16)}</div>
										</div>
									</div>
								  </c:if>
								</c:forEach>
								
								<div id="replay41" class="tab30004">
									<input  id="${comment.id}" type="text" style="width:590px;height:70px;padding:0px;">
									<a href="#"  onclick="repComment('${comment.id}')">
									<div class="tab30005"> 发&nbsp;表 </div>
									</a> </div>
							</div>
						</div>
					  </c:if>
					  </c:forEach>
					</div>
				</div>
				
				<div id="tab4" class="tab4">
					<div class="tab401">
						<div class="tab40101">
							<p style='font-size:18px;font-weight:bold;'>老师介绍</p>
							<br/>
							<table style="border:none;">
								<tr width="738px" height="60px">
								  <td width="80" height="60px"> 
									<a href="http://space.zhuclass.com/#/${teacher.userId}/home">
									  <img src="http://resource.zhuclass.com/cdrmimg/${teacher.userHimg}?w=90&h=90" width="90" height="90" />
									</a> 
								  </td>
								  <td width="446" ><span class="retext05">${teacher.userRnm}</span><br/>
									<br/>
									<a href="#"><img src="${csspath}/images/kczx_son/takj.jpg" ></a>
								  </td>
								</tr>
								<tr width="738px" height="60px" valign="top" style="font-size:14px;">
									<td colspan="2" > <br/>
										${teacher.userDesc} </td>
								</tr>
							</table>
						</div>
						<div class="tab40102">
							<p style='font-size:18px;font-weight:bold;'> 课程详情</p>
							<p>${myCourse.courseDesc}</p>
						</div>
					</div>
				</div>
				<!-- 同学列表  huangt  2014-12-29 -->
				<div id="tab5" class="tab5">
				  <div class="tab501" >
					<c:forEach items="${classmateList.data}" var="classmate" varStatus="stat">
						<div class="tab50101" >
							<div class="tab5010101" > 
							  <a href="#"> 
							    <img src="http://resource.zhuclass.com/cdrmimg/${classmate.userHimg}?w=90&h=90" width="90" height="90" />
							  </a> 
							</div>
							<div class="tab5010102" > 
							  <a href="http://space.zhuclass.com/#/${classmate.userId}/home ">
								<p class="home_text04" style="text-align:center">${classmate.userLnm}</p>
							  </a> 
							</div>
						</div>
						<div class="tab50102" > </div>
					</c:forEach>
				  </div>
				</div>
			</div>
			
			<div class="tab_divr">
				<div class="home_textdiv01 home_text01" style="text-indent:1em;">推荐课程</div>
				<div class="tab_divrt">
					<div style="width:100%;height:20px;"></div>
					
					<c:forEach items="${courseTop}" var="top">
					    <div class="course_recommend">
							<div class="course_recommendl"> <a href="http://www.zhuclass.com/course/detail/${top.course_id}"><img src="http://resource.zhuclass.com/cdrmimg/${top.course_pimg}?w=90&h=90" ></a> </div>
							<div class="course_recommendr">
								<div class="course_recommendr01"> <a href="http://www.zhuclass.com/course/detail/${top.course_id}" target="_blank">${top.course_nm}</a> </div>
								<div class="course_recommendr02"> <span class="retext05">
								<c:if test="${empty top.count_stu}">
									0
								</c:if>
								<c:if test="${not empty top.count_stu}">
									${top.count_stu}
								</c:if>
								</span> 人学习 </div>
							</div>
						</div>
					</c:forEach>
				</div>
			</div>
		</div>
	</c:otherwise>
  </c:choose>
  </div>
 
 <%@ include file="../all_buttom.jsp"%>

</body>
</html>